/* 全局 */
#app {
    height: 100%;
}

/* 登录 */
#login {
    width: 100%;
    height: 100%;
    background: url('../image/login-bg.png') center center no-repeat;
    background-size: cover;
    color: #fff;
}

#login .home {
    font-size: 22px;
    display: flex;
    align-items: center;
    position: absolute;
    top: 50px;
    left: 60px;
}

#login .home img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin-right: 10px;
}

#login .container {
    border-radius: 10px;
    position: absolute;
    top: -75px;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 520px;
    height: 430px;
    padding: 50px 80px;
    background: rgba(0, 0, 0, 0.25);
}

#login .container .title .el-form-item__content {
    font-size: 26px;
    font-weight: bold;
    text-align: center;
}

#login .el-button {
    width: 100%;
    height: 50px;
    font-size: 16px;
    background: #43b786;
    letter-spacing: 1px;
}

#login .el-button:hover,
#login .el-button:active,
#login .el-button:focus {
    background: #45c28e;
}

#login .el-input__inner {
    height: 48px;
}

#login .el-input__icon {
    line-height: 48px;
}

#login .el-input__icon {
    width: 40px;
}

#login .el-input--prefix .el-input__inner {
    padding-left: 40px;
}

#login .el-input__inner:focus {
    border-color: #C0C4CC;
}

#login .captcha {
    width: 120px;
    height: 40px;
    position: absolute;
    right: 4px;
    top: 4px;
    cursor: pointer;
    border: 1px solid #d8d8d8;
    padding: 3px;
}

#login .el-form-item__content {
    margin-left: 0 !important;
}

#login .el-form {
    margin-top: 0 !important;
}

/* 404错误页 */
#error {
    border-radius: 10px;
    position: absolute;
    top: -75px;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 520px;
    height: 430px;
    padding: 50px 80px;
}

#error .number {
    font-size: 120px;
    font-family: '宋体';
    margin-bottom: 10px;
}

#error .title {
    font-size: 20px;
}

#error .en {
    font-size: 16px;
    color: #888;
    margin: 15px 0 25px;
}

#error .back {
    width: 220px;
}

/* 主页 */
#main {
    min-width: 1024px;
    height: 100%;
}

#main .el-container {
    height: 100%;
}

#main .menu {
    box-shadow: 0px 1px 5px 0 rgb(0 0 0 / 10%);
}

#main .menu .first {
    background: linear-gradient(90deg, #282c34, #000);
    text-align: center;
}

#main .menu .first::-webkit-scrollbar {
    width: 0;
}

#main .menu .first .logo {
    height: 60px;
    padding: 15px;
    cursor: pointer;
}

#main .menu .first img {
    width: 32px;
}

#main .menu .first li {
    width: 66px;
    height: 66px;
    color: #fff;
    cursor: pointer;
    padding: 5px;
}

#main .menu .first li i {
    font-size: 18px;
    margin-bottom: 4px;
}

#main .menu .first li div {
    display: flex;
    flex-flow: column;
    justify-content: center;
    justify-items: center;
    height: 56px;
    border-radius: 4px;
}

#main .menu .first li.active div,
#main .menu .first li:hover div {
    background: #43b786;
    transition: all 0.2s linear;
}

#main .menu .el-submenu .el-menu-item {
    padding-left: 49px !important;
}

#main .menu .el-menu {
    border: none;
}

#main .menu .el-divider {
    margin: 10px 0 20px;
}

#main .menu .el-divider div {
    color: #888;
}

#main .menu .second {
    padding-bottom: 20px;
}

#main .menu .second .center {
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 20px;
    color: #555;
}

#main .el-menu-item * {
    vertical-align: inherit;
}

#main .el-menu-item.is-active,
#main .el-menu-item.active,
#main .el-menu-item:hover,
#main .el-submenu__title:hover {
    background-color: #ecf8f3 !important;
    color: #43b786 !important;
}

#main .el-menu-item.is-active i,
#main .el-menu-item.active i,
#main .el-menu-item:hover i,
#main .el-submenu__title:hover i {
    color: #43b786 !important;
}

#main .second i {
    width: 24px;
    display: inline-block;
    text-align: center;
}

#main .el-header {
    height: 61px !important;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #dcdfe6;
}

#main .el-breadcrumb__separator {
    margin: 0 10px;
    font-weight: normal;
}

#main .el-header .nav {
    display: flex;
}

#main .el-header .username,
#main .el-header .el-dropdown-link {
    display: flex;
    align-items: center;
}

#main .el-header .username span {
    margin-right: 25px;
    cursor: pointer;
}

#main .el-header .username .avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    margin-right: 10px;
}

#main .el-dropdown .arrow {
    margin-left: 5px;
    font-size: 12px;
}

#main .el-dropdown-menu__item i {
    font-size: 16px;
}

#main .el-breadcrumb {
    margin-top: 2.5px;
    margin-left: 15px;
}

#main .el-header .fold {
    font-size: 20px;
    color: #555;
    cursor: pointer;
}

#main .el-main {
    background: #f7f7f7;
    padding: 13px 15px;
}

#main .el-main>div {
    background: #fff;
    height: 100%;
    padding: 15px 20px;
}

#main .el-breadcrumb__inner a:hover,
#main .el-breadcrumb__inner.is-link:hover {
    color: #43b786;
}

#main .el-breadcrumb__item:last-child .el-breadcrumb__inner a,
#main .el-breadcrumb__item:last-child .el-breadcrumb__inner a:hover {
    color: #606266 !important;
    cursor: pointer;
}

.el-dropdown-menu__item:focus,
.el-dropdown-menu__item:not(.is-disabled):hover {
    color: #43b786 !important;
    background: #ecf8f3 !important;
}

/* 统计 */
#home .el-card__body {
    display: flex;
}

#home .el-card__body img {
    width: 54px;
    height: 54px;
    border-radius: 50%
}

#home .el-card__body div {
    line-height: 54px;
    padding-left: 30px;
    font-size: 16px;
}

#home .speed {
    margin-top: 40px;
}

#home .title {
    font-size: 15px;
}

#home .desc {
    font-size: 12px;
    margin: 5px 0;
    color: #a9a9a9;
}

#home .speed ul {
    display: flex;
    padding: 0 2px;
    margin-top: 15px;
}

#home .speed ul a {
    width: 280px;
    min-width: 280px;
    height: 80px;
    margin-right: 15px;
    box-shadow: 0px 1px 5px 0 rgb(0 0 0 / 15%);
    background: #fefefe;
    text-align: center;
    line-height: 78px;
    cursor: pointer;
    font-size: 15px;
}

#home .speed ul a:hover {
    background: #f9f9f9;
    transition: all 0.2s linear;
}

#home .speed ul a i {
    margin-right: 10px;
}

#home .total {
    display: flex;
    margin: 50px 0 20px;
}

#home #chartOne {
    width: 800px;
    height: 400px;
}

#home #chartTwo {
    width: 700px;
    height: 400px;
}